<template>
	<view>
		<view class="tools">
			<view class="tools-item">
				<view class="t">绑定手机</view>
				<view class="arrow">{{userInfo.user_phone}}</view>
			</view>

			<view class="tools-item">
				<view class="t">接收通知</view>
				<view class="arrow"><u-switch v-model="push" @change="change"></u-switch></view>
			</view>
		</view>
	</view>
</template>


<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import {
		doProfile,
		getUserProfile
	} from '@/api/api.js';
	export default {
		data() {
			return {
				push: false,
				userData: []
			}
		},
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		onLoad() {
			if (this.hasLogin) {
				this.getProfile()
			} else {
				uni.navigateBack({
					delta: 2
				})
			}
		},
		methods: {
			...mapMutations(['userLogin', 'logout']),
			getProfile() {
				let _this = this
				getUserProfile().then(r => {
					if (r.data.code == 200) {
						_this.userData = r.data.data.user
						_this.push = r.data.data.user.user_push === 1 ? true : false
					}
				})
			},
			setProfile(k, v) {
				let _this = this
				let profile = {}
				profile[k] = v;
				doProfile(profile).then(r => {
					if (r.data.code == 200) {
						_this.getProfile()
					}
				})
			},
			change(e) {
				let _this = this
				if (e === true) {
					wx.requestSubscribeMessage({
						tmplIds: ['gvzBY_YkmP0FLUJOAFz3JQpO4suI3tLHvpmee1bDaC4'],
						complete(res) {
							if (res.errMsg == "requestSubscribeMessage:ok") {
								if (res['gvzBY_YkmP0FLUJOAFz3JQpO4suI3tLHvpmee1bDaC4']=='accept') {
									_this.setProfile('push', true)
								}else{
									_this.push = false
									_this.setProfile('push', false)
								}
							}
						}
					})
				} else {
					_this.push = false
					_this.setProfile('push', false)
				}

			}

		}
	}
</script>

<style lang="scss" scoped>
	.tools {

		.tools-item {
			padding: 30rpx 40rpx;
			display: flex;
			justify-content: space-between;
			border-bottom: 2rpx solid #eee;

			.arrow {
				display: flex;
				align-items: center;
				color: #999;

				.iconfont {
					color: #333;
				}
			}

			.t {
				display: flex;
				align-items: center;
				font-size: 32rpx;
				color: #333;

				.iconfont {
					color: #333;
					font-size: 40rpx;
					margin-right: 10rpx;
					color: $base-color;
				}
			}
		}
	}
</style>